<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8" />
    <title>智慧社区-物业管理</title>

    <meta name="description" content="Dashboard" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/assets/img/favicon.png" type="image/x-icon">

    <!--Basic Styles-->
    <link href="${pageContext.request.contextPath}/resource/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/font-awesome.min.css" rel="stylesheet" />

    <!--Beyond styles-->
    <link href="${pageContext.request.contextPath}/resource/assets/css/beyond.min.css" rel="stylesheet" type="text/css" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/animate.min.css" rel="stylesheet" />
<script src="${pageContext.request.contextPath}/resource/assets/js/skins.min.js"></script>
</head>
<body>
<%@include file="../header.jsp" %>
	<!-- Main Container -->
    <div class="main-container container-fluid">
        <!-- Page Container -->
        <div class="page-container">
            <!-- Page Sidebar -->
            <%@include file="../nav.jsp" %><!-- /Page Sidebar -->
            <!-- Page Content -->
            <div class="page-content">
                <!-- Page Breadcrumb -->
                <div class="page-breadcrumbs">
                    <ul class="breadcrumb" style="margin-top: 8px;">
                        <li>
                            <i class="fa fa-home"></i>
                            <a href="#">首页</a>
                        </li>
                        <li><a href="#">房产管理</a></li>
                        <li class="active">添加房产</li>
                    </ul>
                </div><!-- /Page Breadcrumb -->
                <!-- Page Header -->
                <div class="page-header position-relative">
                    <div class="header-title" style="margin-top: 2px;">
                        <h1>
                           添加房产
                        </h1>
                    </div><!--Header Buttons-->
                    <div class="header-buttons">
                        <a class="sidebar-toggler" href="#">
                            <i class="fa fa-arrows-h"></i>
                        </a>
                        <a class="refresh" id="refresh-toggler" href="">
                            <i class="glyphicon glyphicon-refresh"></i>
                        </a>
                        <a class="fullscreen" id="fullscreen-toggler" href="#">
                            <i class="glyphicon glyphicon-fullscreen"></i>
                        </a>
                    </div><!--Header Buttons End-->
                </div><!-- /Page Header -->
                <!-- Page Body -->
                <div class="page-body">
                	<div class="row">
	                	<div class="col-lg-6 col-sm-6 col-xs-12">
	                		<div class="widget">
                                        <div class="widget-header bordered-bottom bordered-palegreen">
                                            <span class="widget-caption">添加房产</span>
                                        </div>
                                        <div class="widget-body">
                                           <div id="registration-form">
                                                        <form role="form">
                                                            <div class="form-title">
                                                            	房产信息
                                                            </div>
                                                            	<div class="form-group">
                                                                        <span class="input-icon icon-right">
                                                                            <input type="text" class="form-control" placeholder="所属小区" value="${loginUser.loginVillage.name}" disabled>
                                                                            <i class="glyphicon glyphicon-globe"></i>
                                                                       </span>
                                                              	</div>
                                                            <div class="form-group">
                                                                <span class="input-icon icon-right">
                                                                    <input id="region" type="text" class="form-control"  placeholder="区/期" value="${house.region }">
                                                                    <i class="glyphicon glyphicon-stats"></i>
                                                                </span>
                                                            </div>
                                                            
                                                            <div class="form-group">
                                                                 <select id="sBuilding" style="width:100%;">
                                                                  		<option value="0"> 栋 </option>
						                                                <option value="1"> 1 </option>
												                        <option value="2"> 2 </option>
												                        <option value="3"> 3 </option>
												                        <option value="4"> 4 </option>
												                        <option value="5"> 5 </option>
												                        <option value="6"> 6 </option>
												                        <option value="7"> 7 </option>
												                        <option value="8"> 8 </option>
												                        <option value="9"> 9 </option>
												                        <option value="10"> 10 </option>
												                        <option value="11"> 11 </option>
												                        <option value="12"> 12 </option>
												                        <option value="13"> 13 </option>
												                        <option value="14"> 14 </option>
												                        <option value="15"> 15 </option>
												                        <option value="16"> 16 </option>
												                        <option value="17"> 17 </option>
												                        <option value="18"> 18 </option>
												                        <option value="19"> 19 </option>
												                        <option value="20"> 20 </option>
												                        <option value="21"> 21 </option>
												                        <option value="22"> 22 </option>
												                        <option value="23"> 23 </option>
												                        <option value="24"> 24 </option>
												                        <option value="25"> 25 </option>
												                        <option value="26"> 26 </option>
												                        <option value="27"> 27 </option>
												                        <option value="28"> 28 </option>
												                        <option value="29"> 29 </option>
												                        <option value="30"> 30 </option>
                                            						</select>
                                                            </div>
                                                            <div class="form-group">
                                                                 <select id="sEntrance" style="width:100%;">
                                                                 		<option value="0"> 单元 </option>
						                                                <option value="1"> 1 </option>
												                        <option value="2"> 2 </option>
												                        <option value="3"> 3 </option>
												                        <option value="4"> 4 </option>
												                        <option value="5"> 5 </option>
												                        <option value="6"> 6 </option>
												                        <option value="7"> 7 </option>
												                        <option value="8"> 8 </option>
												                        <option value="9"> 9 </option>
												                        <option value="10"> 10 </option>
                                            						</select>
                                                            </div>
                                                            <div class="form-group">
                                                                <span class="input-icon icon-right">
                                                                    <input id="number" type="text" class="form-control"  placeholder="室" value="${house.number }">
                                                                    <i class="glyphicon glyphicon-align-right"></i>
                                                                </span>
                                                            </div>
                                                            <div class="form-group">
                                                                <span class="input-icon icon-right">
                                                                    <input id="area" type="text" class="form-control"  placeholder="房产面积" value="${house.area }">
                                                                    <i class="glyphicon glyphicon-align-right"></i>
                                                                </span>
                                                            </div>
                                                            <div class="form-group">
                                                                <span class="input-icon icon-right">
                                                                    <input id="price" type="text" class="form-control"  placeholder="物业费单价(元/平米)" value="${house.price }">
                                                                    <i class="glyphicon glyphicon-align-right"></i>
                                                                </span>
                                                            </div>
                                                          <div class="form-group">
                                                                        <span class="input-icon icon-right">
                                                                            <input id="hostName" type="text" class="form-control" placeholder="业主姓名" value="${house.name }">
                                                                            <i class="glyphicon glyphicon-user"></i>
                                                                        </span>
                                                                    </div>
                                                            <div class="form-group">
                                                                <span class="input-icon icon-right">
                                                                    <input id="phoneNumber" type="text" class="form-control"  placeholder="业主电话" value="${house.phoneNumber }">
                                                                    <i class="glyphicon glyphicon-align-right"></i>
                                                                </span>
                                                            </div>        
                                                            
                                                            <div class="form-group">
                                                                <span class="input-icon icon-right">
                                                                    <input type="text" class="form-control" id="hostId" placeholder="身份证" value="${house.id }">
                                                                    <i class="fa fa-credit-card"></i>
                                                                </span>
                                                            </div>
                                                            <div class="form-group">
                                                                <div class="input-group">
							                                         <input class="form-control date-picker" id="buyTime" type="text" placeholder="购房时间" data-date-format="yyyy/mm/dd">
							                                            <span class="input-group-addon">
							                                                <i class="fa fa-calendar"></i>
							                                            </span>
							                                    </div>        
                                                            </div>
                                                                  
                                                            <div class="form-group">
                                                                <div class="input-group">
							                                         <input class="form-control date-picker" id="getTime" type="text" placeholder="下次物业费缴纳时间" data-date-format="yyyy/mm/dd">
							                                            <span class="input-group-addon">
							                                                <i class="fa fa-calendar"></i>
							                                            </span>
							                                    </div>        
                                                            </div>
                                                            
                                                            <hr class="wide" />
                                                            <div class="row" style="text-align: right;margin-right: 10px;">
                                                            	<button type="button" class="btn btn-warning" onclick="cancel()"> 取 消 </button>
                                                            	<button type="button" class="btn btn-blue" onclick="save()"> 添 加 </button>
                                                            </div>
                                                            
                                                        </form>
                                                    </div> 
                                        </div>
                                    </div>
	                	</div>
                	
                    </div>
                </div><!-- /Page Body -->
             </div><!-- /Page Content -->
     	</div><!-- /Page Container -->
     </div><!-- /Main Container -->
     	<script src="${pageContext.request.contextPath}/resource/assets/js/jquery-2.0.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/bootstrap.min.js"></script>

    <!--Beyond Scripts-->
    <script src="${pageContext.request.contextPath}/resource/assets/js/select2/select2.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/beyond.min.js"></script>
    
    <script src="${pageContext.request.contextPath}/resource/assets/js/datetime/bootstrap-datepicker.js"></script>
    
    <script type="text/javascript">
    	$('.loading-container').hide();
    	$('#menu_house').addClass("active open");
    	$('#menu_house_add').addClass("active");
    	$("#sBuilding").select2();
    	$("#sEntrance").select2();
    	var selectBuilding = "${house.building}";
    	var selectEntrance = "${house.entrance}";
    	var houseId = "${house.objectId}";
    	var buyTime = "${house.buyAt}";
    	var getTime = "${house.getAt}";
    	
    	$('#buyTime').datepicker().on('changeDate',function(event){
    		buyTime = event.date.valueOf();
    	});
    	$('#getTime').datepicker().on('changeDate',function(event){
    		getTime = event.date.valueOf();
    	});
    	
    	if(selectBuilding != ""){
			$('#sBuilding').val(selectBuilding).trigger("change");
			$('#sEntrance').val(selectEntrance).trigger("change");
			$('#buyTime').val(unixToDate(buyTime));
			$('#getTime').val(unixToDate(getTime));
			$("#phoneNumber").attr('disabled',true);
		}
		
    	function save(){
    		var region = $('#region').val();
    		var building = $('#sBuilding').val();
    		var entrance = $('#sEntrance').val();
    		var number = $('#number').val();
    		var name = $('#hostName').val();
    		var area = $('#area').val();
    		var price = $("#price").val();
    		var phoneNumber = $("#phoneNumber").val();
    		if ($.trim(region) == "" || $.trim(number) == "" || $.trim(name) == "" || $.trim(phoneNumber) == "") {
    			alert("请完善房产信息后再提交保存");
    			return;
    		}
    		
    		var re = /^\d+(.\d{1,2})?$/;
    		if(area != ""){
    			if (!re.test(area)) {
        			alert("房产面积请填写正数！");
        			return;
    			}
    		}
    		
    		if(price != ""){
    			if (!re.test(price)) {
        			alert("物业费单价填写正数！");
        			return;
    			}
    		}
    		
    	   var regx = /^((\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$)$/;
    		
    	   if(!regx.test(phoneNumber)){
    		   alert("请填写正确的电话号码或者手机号码！");
    		   return;
    	   }
    		
    		$('.loading-container').show();
    		$.ajax({
    			"url":"${pageContext.request.contextPath}/house_add",
    			"data":{objectId:houseId,region:region,building:building,entrance:entrance,number:number,name:name,buyAt:buyTime,getAt:getTime,area:area,price:price,phoneNumber:phoneNumber,voipPhoneNumber:phoneNumber},
    			"type":'post',
    			"dataType":'json',
    			"success" : function(result) {
    				$('.loading-container').hide();
    				if (result == 201){
    					alert("鉴权已过期，请重新登录");
    					location.href="/SmartComm";
    					return;
    				}
    				if (result == 200) {
    					alert("房产信息保存成功");
    					cancel();
    				}else {
    					alert("提交失败，请检查网络后重试~");
    				}
    			},
    			"error" : function(msg) {
    				$('.loading-container').hide();
    				alert("error msg:"+msg.responseText);
    			}
    		});
    	}
    	
    	function cancel(){
    		$('#region').val("");
			$('#number').val("");
			$('#hostName').val("");
			$('#hostId').val("");
			$('#sBuilding').val("0").trigger("change");
			$('#sEntrance').val("0").trigger("change");
    	}
    </script>
</body>
</html>